<template>
  <div class="h-full">
    <div class="title"><b>Oops!!</b>&nbsp;页面跑丢啦...</div>
    <img src="/svg/404.svg" alt="404" class="not-found-img" />
    <div style="margin-top: 30px;">
      <router-link to="/">
        <el-button>返回首页</el-button>
      </router-link>
    </div>
    <div class="countdown" style="margin-top: 30px; font-size: 14px; color: #666;">
        页面将在<b>{{ countdown }}</b> 秒后自动跳转到首页
    </div>
    <!-- <div style="margin-top: 30px; font-size: 12px">版权所有：陕西华氏医药有限公司 Copyright © 2015-2025 cyhsyy.com All rights reserved</div> -->
  </div>
</template>

<script>
export default {
  name: 'NotFoundView',
  data() {
    return {
      countdown: 6,
    };
  },
  mounted() {
    this.timer = setInterval(() => {
      this.countdown--;
      if (this.countdown <= 0) {
        clearInterval(this.timer);
        this.$router.push('/');
      }
    },1000)
  }
} 
</script>

<style scoped>
.h-full {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.h-full img {
  width: 500px;
}

.h-full .title {
  font-size: 26px;
  margin-bottom: 20px;
  font-weight: bold;
}

.h-full .title b {
  color:#a71212c7;
  font-size: 32px;
}
.countdown b{
    color:#a71212c7;
    font-size:15px;
    margin-left:5px;
}
</style>